<template>
  <div class="divBox relative">
    <el-card class="box-card">
      <div slot="header" class="clearfix">
        <div class="container mt-1">
          <el-form inline size="small">
      
             <el-form-item label="排班日期">
                <el-date-picker v-model="tableFrom.plan_dates_range" value-format="yyyy-MM-dd" format="yyyy-MM-dd" size="small" type="daterange" placement="bottom-end" placeholder="自定义时间" style="width: 240px;" @change="onchangeTime" />
            </el-form-item>
            <el-form-item label="班次状态：">
              <el-select v-model="tableFrom.status" placeholder="请选择线路特性" class="mr20"  style="width:100%;"  @change="seachList">
                <el-option label="终止运营" :value="0" ></el-option>
                <el-option label="正常运营" :value="1" ></el-option>
              </el-select>
            </el-form-item>
            <el-form-item label="选择线路">
              <el-select
                v-model="tableFrom.product_id"
                filterable
                remote
                reserve-keyword
                clearable
                placeholder="请输入线路名称"
                :remote-method="remoteMethod"
                :loading="loading">
                <el-option
                  v-for="item in options"
                  :key="item.product_id"
                  :label="item.store_name"
                  :value="item.product_id">
                </el-option>
              </el-select>
            </el-form-item>
            <el-form-item label="条件搜索：">
              <el-input v-model="tableFrom.keyword" placeholder="请输入班次名称,关键字,ID" size="small" style="width: 240px" clearable>
                <el-button slot="append" icon="el-icon-search" @click="seachList" size="small" />
              </el-input>
            </el-form-item>
          </el-form>
        </div>
        <el-button size="small" icon="el-icon-circle-plus-outline" type="warning" class="mr10" @click="addTemporaryPlanShow=true" >排班</el-button>
        <el-button size="small" icon="el-icon-edit-outline" type="danger" class="mr10"  @click="batchEditShow=true">批量修改</el-button>
        <el-button size="small" icon="el-icon-download" @click="exports" >导出</el-button>
      </div>
      <el-table
        v-loading="listLoading"
        :data="tableData.data"
        style="width: 100%"
        size="mini"
        :highlight-current-row="true"
        :header-cell-style=" {fontWeight:'bold'}"
      >
        <el-table-column label="ID"
          prop="id"
          min-width="30"
          v-if="checkedCities.includes('ID')"
        />
        <el-table-column label="班次时间"
          prop="date"
          min-width="100"
          v-if="checkedCities.includes('班次时间')"
          :show-overflow-tooltip="true">
        </el-table-column>
         <el-table-column
          label="产品名称"
          min-width="150"
          align="center"
          v-if="checkedCities.includes('产品名称')"
        > 
          <template slot-scope="scope">
              <span v-if="scope.row.product&&scope.row.product.store_name">{{scope.row.product.store_name}}</span>
          </template>
        </el-table-column>
        <el-table-column
          label="出发城市"
          min-width="50"
          align="center"
          v-if="checkedCities.includes('出发城市')"
        > 
          <template slot-scope="scope">
              <span v-if="scope.row.product&&scope.row.product.start_city">{{scope.row.product.start_city}}</span>
              <span v-else>---</span>
          </template>
        </el-table-column>
        <el-table-column
          label="到达城市"
          min-width="50"
          align="center"
          v-if="checkedCities.includes('到达城市')"
        > 
          <template slot-scope="scope">
              <span v-if="scope.row.product&&scope.row.product.end_city">{{scope.row.product.end_city}}</span>
              <span v-else>---</span>
          </template>
        </el-table-column>
        <el-table-column
          label="出发地"
          min-width="80"
          align="center"
          v-if="checkedCities.includes('出发地')"
        > 
          <template slot-scope="scope">
              <span v-if="scope.row.product&&scope.row.product.start_stop_name">{{scope.row.product.start_stop_name}}</span>
              <span v-else>---</span>
          </template>
        </el-table-column>
        <el-table-column
          label="目的地"
          min-width="80"
          align="center"
          v-if="checkedCities.includes('目的地')"
        > 
          <template slot-scope="scope">
              <span v-if="scope.row.product&&scope.row.product.end_stop_name">{{scope.row.product.end_stop_name}}</span>
              <span v-else>---</span>
          </template>
        </el-table-column>
        <!-- <el-table-column
          prop="verify_code"
          label="验证码"
          min-width="50"
          align="center"
          v-if="checkedCities.includes('验证码')"
        /> -->
        <!-- <el-table-column
          label="商户"
          min-width="80"
          align="center"
          v-if="checkedCities.includes('商户')"
        > 
          <template slot-scope="scope">
              <span v-if="scope.row.merchantscope.row.merchant.mer_name">{{scope.row.merchant.mer_name}}</span>
              <span v-else>---</span>
          </template>
        </el-table-column> -->
  
        <el-table-column
          label="套餐信息"
          min-width="100"
          align="center"
          v-if="checkedCities.includes('套餐信息')"
        > <template slot-scope="scope">
           <!-- <div v-if="scope.row.linePlanMeal.length" v-for="meal in scope.row.linePlanMeal">
            <span>{{meal.title}}-￥{{meal.adult_price}}</span>
           </div>
           <div v-if="!scope.row.linePlanMeal.length">--</div> -->
            <div v-if="scope.row.linePlanMeal.length" >
            <el-button type="success" size="mini" @click="lookMeal(scope.row)">{{scope.row.linePlanMeal.length}}个套餐</el-button>
           </div>
           <div v-if="!scope.row.linePlanMeal.length">--</div>
          </template>
        </el-table-column>
        <el-table-column
          label="班次类型"
          min-width="50"
          align="center"
          v-if="checkedCities.includes('班次类型')"
        > <template slot-scope="scope">
            <span v-if="scope.row.plan_type==1">固定班</span>
            <span v-if="scope.row.plan_type==2">流水班</span>
            <span v-if="scope.row.plan_type==3" style="color: red;">预约班</span>
          </template>
        </el-table-column>
        <el-table-column
          label="是否必发"
          min-width="50"
          align="center"
          v-if="checkedCities.includes('是否必发')"
        > <template slot-scope="scope">
            <span v-if="scope.row.is_must==1">必发车</span>
            <span v-if="scope.row.is_must==0">预约车</span>
          </template>
        </el-table-column>
        <el-table-column
          prop="stock"
          label="座位数"
          min-width="50"
          align="center"
          v-if="checkedCities.includes('座位数')"
        />

         <el-table-column
          label="售票数"
          min-width="50"
          align="center"
          v-if="checkedCities.includes('售票数')"
        > 
          <template slot-scope="scope">
            <span v-if="scope.row.sales" style="color: #FF0000;font-weight:700">{{scope.row.sales}}</span>
            <span v-else>0</span>
          </template>
      </el-table-column>
         <!-- <el-table-column
          prop="send_times"
          label="发送短信次数"
          min-width="50"
          align="center"
          v-if="checkedCities.includes('发送短信次数')"
        /> -->
        <!-- <el-table-column
          label="司机-车牌"
          min-width="50"
          align="center"
          v-if="checkedCities.includes('司机-车牌')"
        > <template slot-scope="scope">
           <div v-if="scope.row.driver_name || scope.row.car_number" @click="driverClick(scope.row)">
            <div>{{scope.row.driver_name ? scope.row.driver_name : ''}}</div>
            <div>{{scope.row.car_number ? scope.row.car_number : ''}}</div>
           </div>
           <span style="color:#007AFF" v-else size="small" @click="driverClick(scope.row)">添加司机</span>
          </template>
        </el-table-column> -->
        <el-table-column
          label="备注"
          min-width="50"
          align="center"
          v-if="checkedCities.includes('备注')"
        > 
          <template slot-scope="scope">
            <span v-if="scope.row.remark">{{scope.row.remark}}</span>
            <span v-else>---</span>
          </template>
      </el-table-column>
        <el-table-column label="操作" min-width="150" fixed="right" align="center" :render-header="renderHeader">
           <template slot-scope="scope">
            <a v-if="scope.row.status===0"  style="color:#16a73e" size="small" @click="changePlaneStatusClick('add', scope.row)">上线</a>
            <a v-else style="color:red" size="small" @click="changePlaneStatusClick('remove', scope.row)">下线</a>
            <el-divider   direction="vertical"></el-divider>
            <a   style="color:#007AFF"   size="small" @click="ediePlanClick(scope.row)">编辑</a>
            <el-divider  direction="vertical"></el-divider>
            <a  style="color:#007AFF"  size="small" @click="lookPassenger(scope.row)">查看乘客</a>
            <!-- <el-divider   direction="vertical"></el-divider>
            <a   style="color:#007AFF"  size="small" @click="sendSms(scope.row)">发送短信</a>      -->
           </template>
        </el-table-column>
      </el-table>
      <div class="block">
        <el-pagination
          :page-sizes="[20, 40, 60, 80]"
          :page-size="tableFrom.limit"
          :current-page="tableFrom.page"
          layout="total, sizes, prev, pager, next, jumper"
          :total="tableData.total"
          @size-change="handleSizeChange"
          @current-change="pageChange"
        />
      </div>
    </el-card>
    <div class="card_abs" v-show="card_select_show">
      <template>
        <div class="cell_ht">
          <el-checkbox :indeterminate="isIndeterminate" v-model="checkAll" @change="handleCheckAllChange">全选</el-checkbox>
          <el-button type="text" @click="checkSave()">保存</el-button>
        </div>
        <el-checkbox-group v-model="checkedCities" @change="handleCheckedCitiesChange">
          <el-checkbox v-for="item in columnData" :label="item" :key="item" class="check_cell">{{item}}</el-checkbox>
        </el-checkbox-group>
      </template>
    </div>

   
    <!-- 排班 -->
    <el-dialog title="排班" :visible.sync="addTemporaryPlanShow" width="70%" :close-on-click-modal="false"  @close="closeForm('temporaryForm')">
       <el-form :model="temporaryForm" :rules="rules" ref="temporaryForm" label-width="130px" class="formValidate mt20" >
          <el-form-item label="选择直通车产品："  prop="product_id">
            <el-select
              style="width: 300px;"
              v-model="temporaryForm.product_id"
              filterable
              remote
              reserve-keyword
              placeholder="请输入产品名称搜索"
              :remote-method="remoteMethod"
              :loading="loading">
              <el-option
              style="width: 300px;"
                v-for="item in options"
                :key="item.product_id"
                :label="item.store_name"
                :value="item.product_id">
              </el-option>
            </el-select>
          </el-form-item>

          <el-form-item  label="选择时间周期："  prop="date_list">
            <el-radio v-model="dateType" :label="1">按周</el-radio>
            <el-radio v-model="dateType" :label="2">按日期</el-radio>
            <div v-show="dateType == 1" class="pd-20 bg-f7">
              <el-date-picker
                v-model="date1"
                @change="dateRangeChange"
                type="daterange"
                format="yyyy-MM-dd"
                value-format="yyyy-MM-dd"
                placeholder="选择日期范围">
              </el-date-picker>
              <el-checkbox-group v-model="checkList" @change="checkChange" class="mt-10" >
                <el-checkbox :label="1">每周一</el-checkbox>
                <el-checkbox :label="2">每周二</el-checkbox>
                <el-checkbox :label="3">每周三</el-checkbox>
                <el-checkbox :label="4">每周四</el-checkbox>
                <el-checkbox :label="5">每周五</el-checkbox>
                <el-checkbox :label="6">每周六</el-checkbox>
                <el-checkbox :label="0">每周日</el-checkbox>
                </el-checkbox-group>
            </div>
            <div v-show="dateType ==2"  class="pd-20 bg-f7">
              <el-date-picker
                v-model="date2"
                @change="datesChange"
                type="dates"
                format="yyyy-MM-dd"
                value-format="yyyy-MM-dd"
                placeholder="选择日期">
              </el-date-picker>
            </div>
          </el-form-item>
        

          <!-- <el-form-item label="出发时间：" prop="dp_time">
            <el-time-picker
                v-model="temporaryForm.dp_time"
                placeholder="车辆出发时间"
                format="HH:mm"
                value-format="HH:mm"
                :clearable="false"
                >
              </el-time-picker>
          </el-form-item> -->

          <el-form-item label="出发时间："  prop="dp_time_list">
            <div class="dp">
              <div class="" >
                <span v-for="(item,index) in temporaryForm.dp_time_list" :key="index" class="el-tag el-tag--info el-tag--small el-tag--light" style="margin: 0 4px;">
                  <span class="el-select__tags-text">
                    {{item}}
                  </span>
                   <i class="el-tag__close el-icon-close" @click="delDp(index)"></i>
                </span>
              </div>
              <div style="margin-left:15px">
                <el-button type="primary" size="mini" icon="el-icon-circle-plus-outline">新增</el-button>
                <div class="dp-block">
                  <el-time-picker
                    v-model="value1"
                    placeholder="任意时间点"
                    format="HH:mm"
                    value-format="HH:mm"
                    :clearable="false"
                    @change="dpChange"
                    >
                  </el-time-picker>
              </div>
              </div>
            </div>
          </el-form-item>

          <el-form-item label="座位数量：" prop="stock"> 
            <el-input-number v-model="temporaryForm.stock" :min="0"  step-strictly placeholder="请输入"  />
          </el-form-item> 

          <el-form-item  label="班次类型："  prop="plan_type">
              <el-radio-group v-model="temporaryForm.plan_type">
                <el-radio :label="1">固定班</el-radio>
                <el-radio :label="2">流水班</el-radio>
                <el-radio :label="3">预约班</el-radio>
              </el-radio-group>
          </el-form-item>

          <el-form-item v-if="temporaryForm.plan_type==2" label="间隔时间(分钟)：" prop="division_time">
            <el-input-number v-model="temporaryForm.division_time" step-strictly :min="0" placeholder="请输入"  />
          </el-form-item> 
           <el-form-item v-if="temporaryForm.plan_type==3" label="最低发车人数：" prop="lowest_num">
            <el-input-number v-model="temporaryForm.lowest_num" step-strictly :min="0" placeholder="请输入"  />
          </el-form-item> 
          <el-row  :gutter="24">
            <el-col :span="24">
              <el-form-item label="班次套餐:" prop="line_plan_meal">
                <div class="display-flex display-flex-align-center ">
                  <div v-show="temporaryForm.line_plan_meal &&temporaryForm.line_plan_meal.length">
                    <div class="display-flex  " >
                      <div @click="selectMealHanele(index)" v-for="(meal ,index) in temporaryForm.line_plan_meal" :class="selectTempMealIndex==index?'meal-bl-select':'meal-bl-noselect'" class="display-flex-column  mr-20" >
                        <div class="display-flex" style="position: relative;">
                          <div class="display-flex"> 
                            <div class="mr-5">套餐名称:</div>
                            <div  class="line2">{{(meal.title) }}</div>
                          </div>
                          <div @click.stop="editMeal(meal ,index)" v-show="selectTempMealIndex==index" class="ml-auto"> <i style="color: #3c72e4;" class="el-icon-edit-outline ml-10 text-18" ></i></div>
                          <div class="del-box"  @click.stop="deleteTempMeal(index)">
                              <span class="iconfont iconcha"></span>
                          </div>
                        </div>
                        <div class="display-flex"> 
                            <div class="mr-5">套餐价格:</div>
                            <div class="line2">￥{{(meal.adult_price) }}</div>
                          </div>
                      </div>
                    </div>
                  </div>
                  <div>
                    <el-button
                      type="primary"
                      icon="el-icon-plus"
                      class="mr15"
                      size="small"
                      @click="addmealShow"
                    >添加班次套餐</el-button>
                  </div>
                </div>
              </el-form-item>
            </el-col>
           
          </el-row>
        

          <!-- <el-row>
            <el-col :span="10">
              <el-form-item label="成人价格：" prop="adult_price">
                <el-input-number v-model="temporaryForm.adult_price" :min="0" placeholder="请输入成人价格"  style="width: 200px;"/>
              </el-form-item>
            </el-col>
            <el-col :span="14">
              <el-form-item label="儿童价格(0为不售卖儿童票)："  prop="child_price" >
                <el-input-number v-model="temporaryForm.child_price" :min="0" placeholder="请输入儿童价格"   style="width: 200px;"/>
              </el-form-item>
            </el-col>
          </el-row> -->
          <!-- <el-row>
            <el-col :span="10">
              <el-form-item label="司机姓名："  prop="driver_name">
                <el-input v-model="temporaryForm.driver_name"  placeholder="请输入司机姓名"  style="width: 200px;"/>
              </el-form-item>
            </el-col>
            <el-col :span="14">
              <el-form-item label="车牌号："  prop="car_number">
                <el-input v-model="temporaryForm.car_number"  placeholder="请输入车牌号"   style="width: 200px;"/>
              </el-form-item>
            </el-col>
          </el-row> -->

          <el-form-item  label="是否开启返程："  prop="is_return_trip">
              <el-radio-group v-model="temporaryForm.is_return_trip">
                <el-radio :label="0">关闭</el-radio>
                <el-radio :label="1">开启</el-radio>
              </el-radio-group>
          </el-form-item>
            <el-form-item v-if="temporaryForm.is_return_trip" label="返程时间(分钟)：" prop="return_mins">
            <el-input-number v-model="temporaryForm.return_mins" step-strictly :min="0" placeholder="请输入"  />
          </el-form-item> 
          <el-form-item label="备注：" prop="remark">
                <el-input maxlength="100" :show-word-limit="true" type="textarea" style="width:60%"  v-model="temporaryForm.remark" placeholder="输入班次备注"></el-input>
          </el-form-item>
          <el-form-item class="acea-row row-center-wrapper">
            <el-button type="primary"  @click="submTemporaryForm('temporaryForm')">立即保存</el-button>
            <el-button @click="addTemporaryPlanShow=false">取消</el-button>
          </el-form-item>
        </el-form>
    </el-dialog>
    <!-- 排班 -->
    <!-- 批量修改 -->
    <el-dialog title="批量修改" :visible.sync="batchEditShow" width="60%"  @close="closeForm('batchForm')">
       <el-form :model="batchForm" :rules="rules" ref="batchForm" label-width="130px" class="formValidate mt20" >
          <el-form-item label="选择直通车产品："  prop="product_id">
            <el-select
              v-model="batchForm.product_id"
              filterable
              remote
              reserve-keyword
              placeholder="请输入产品名称搜索"
              :remote-method="remoteMethod"
              :loading="loading">
              <el-option
                v-for="item in options"
                :key="item.id"
                :label="item.store_name"
                :value="item.product_id">
              </el-option>
            </el-select>
          </el-form-item>
          <el-form-item label="排班日期：" prop="plan_dates_range">
              <el-date-picker v-model="batchForm.plan_dates_range" value-format="yyyy-MM-dd" format="yyyy-MM-dd" size="small" type="daterange" placement="bottom-end" placeholder="自定义时间" style="width: 220px;" />
          </el-form-item>
          <el-form-item  label="是否运营："  prop="status">
              <el-radio-group v-model="batchForm.status">
                <el-radio :label="1">正常运营</el-radio>
                <el-radio :label="0">终止运营</el-radio>
              </el-radio-group>
          </el-form-item>

 

          <!-- <el-row>
            <el-col :span="10">
              <el-form-item label="司机姓名："  prop="driver_name">
                <el-input v-model="batchForm.driver_name"  placeholder="请输入司机姓名"  style="width: 200px;"/>
              </el-form-item>
            </el-col>
            <el-col :span="14">
              <el-form-item label="车牌号："  prop="car_number">
                <el-input v-model="batchForm.car_number"  placeholder="请输入车牌号"   style="width: 200px;"/>
              </el-form-item>
            </el-col>
          </el-row> -->

          <!-- <el-form-item  label="是否开启返程："  prop="is_return_trip">
              <el-radio-group v-model="batchForm.is_return_trip">
                <el-radio :label="0">关闭</el-radio>
                <el-radio :label="1">开启</el-radio>
              </el-radio-group>
          </el-form-item> -->
            <el-form-item v-if="batchForm.is_return_trip" label="返程时间(分钟)：" prop="return_mins">
            <el-input-number v-model="batchForm.return_mins"  step-strictly :min="0" placeholder="请输入"  />
          </el-form-item> 
          <el-form-item label="备注：" prop="remark">
                <el-input maxlength="100" :show-word-limit="true" type="textarea" style="width:60%"  v-model="batchForm.remark" placeholder="输入班次备注"></el-input>
              </el-form-item>
          <el-form-item class="acea-row row-center-wrapper">
            <el-button type="primary"  @click="submBatchForm('batchForm')">立即保存</el-button>
            <el-button @click="batchEditShow=false">取消</el-button>
          </el-form-item>
        </el-form>
    </el-dialog>
    <!-- 批量修改 -->
    <!-- 修改班次 -->
    <el-dialog title="编辑班次" :visible.sync="PlanFormVisible" width="70%"  @close="closeForm('planForm')">
       <el-form :model="planForm" :rules="rules" ref="planForm" label-width="100px" class="formValidate mt20" >
          <el-form-item label="班次："  prop="date">
            <el-input v-model="planForm.date" disabled placeholder="请输入"></el-input>
          </el-form-item>
          <el-form-item label="座位数量：" prop="stock">
            <el-input-number v-model="planForm.stock" step-strictly :min="0" placeholder="请输入"  />
          </el-form-item> 

           <el-form-item  label="班次类型："  prop="plan_type">
              <el-radio-group v-model="planForm.plan_type">
                <el-radio :label="1">固定班</el-radio>
                <el-radio :label="2">流水班</el-radio>
                <el-radio :label="3">预约班</el-radio>
              </el-radio-group>
          </el-form-item>
          

          <el-form-item v-if="planForm.plan_type==2" label="间隔时间(分钟)：" prop="division_time">
            <el-input-number  v-model="planForm.division_time" step-strictly :min="0" placeholder="请输入"  />
          </el-form-item> 
           <el-form-item v-if="planForm.plan_type==3" label="最低发车人数：" prop="lowest_num">
            <el-input-number v-model="planForm.lowest_num" step-strictly :min="0" placeholder="请输入"  />
          </el-form-item> 
            <el-row  :gutter="24">
            <el-col :span="24">
              <el-form-item label="班次套餐:" prop="planForm_line_plan_meal">
                <div class="display-flex display-flex-align-center ">
                  <div v-show="planForm.line_plan_meal &&planForm.line_plan_meal.length">
                    <div class="display-flex  " >
                      <div @click="selectPlanMealHanele(index)" v-for="(meal ,index) in planForm.line_plan_meal" :class="selectPlanMealIndex==index?'meal-bl-select':'meal-bl-noselect'" class="display-flex-column  mr-20" >
                        <div class="display-flex" style="position: relative;">
                          <div class="display-flex"> 
                            <div class="mr-5">套餐名称:</div>
                            <div  class="line2">{{(meal.title) }}</div>
                          </div>
                          <div @click.stop="editPlanMeal(meal ,index)" v-show="selectPlanMealIndex==index" class="ml-auto"> <i style="color: #3c72e4;" class="el-icon-edit-outline ml-10 text-18" ></i></div>
                          <div class="del-box"  @click.stop="deletePlanMeal(index)">
                              <span class="iconfont iconcha"></span>
                          </div>
                        </div>
                        <div class="display-flex"> 
                            <div class="mr-5">套餐价格:</div>
                            <div class="line2">￥{{(meal.adult_price) }}</div>
                          </div>
                      </div>
                    </div>
                  </div>
                  <div>
                    <el-button
                      type="primary"
                      icon="el-icon-plus"
                      class="mr15"
                      size="small"
                      @click="addPlanMealShow"
                    >添加班次套餐</el-button>
                  </div>
                </div>
              </el-form-item>
            </el-col>
           
          </el-row>


          <!-- <el-form-item  label="是否开启返程："  prop="isReturnTrip">
              <el-radio-group v-model="planForm.isReturnTrip">
                <el-radio :label="0">关闭</el-radio>
                <el-radio :label="1">开启</el-radio>
              </el-radio-group>
          </el-form-item> -->
          <el-form-item v-if="planForm.is_return_trip" label="返程时间：" >
            <el-date-picker
              v-model="planForm.return_trip_date"
              type="datetime"
              value-format="yyyy-MM-dd HH:mm" 
              format="yyyy-MM-dd HH:mm"
              placeholder="选择返程日期时间">
            </el-date-picker>
          </el-form-item> 
          <el-form-item label="备注：" prop="remark">
              <el-input maxlength="100" :show-word-limit="true" type="textarea" style="width:60%"  v-model="planForm.remark" placeholder="输入班次备注"></el-input>
           </el-form-item>
          <el-form-item class="acea-row row-center-wrapper">
            <el-button type="primary"  @click="editPlan('planForm')">立即保存</el-button>
            <el-button @click="PlanFormVisible=false">取消</el-button>
          </el-form-item>
        </el-form>
    </el-dialog>
    <!-- 修改班次 -->
    <!-- 查看乘客 -->
    <el-dialog title="查看乘客" :visible.sync="passengerVisible" width="40%" fullscreen>
       <el-button size="small" type="primary" class="mb-10" icon="el-icon-download" @click="exportPassenger">导出乘客</el-button>
       <el-table
        v-loading="listLoading"
        :data="orderBusList"
        style="width: 100%"
        size="mini"
        :highlight-current-row="true"
        :header-cell-style=" {fontWeight:'bold'}"
      >
        <el-table-column label="手机号"
          prop="user_phone"
          min-width="100"
        />
        <el-table-column label="姓名"
          prop="name"
          min-width="100"
        />
        <el-table-column label="身份证号"
          prop="id_card"
          min-width="100"
        />
        <el-table-column label="订单号"
          prop="order_sn"
          min-width="90"
          :show-overflow-tooltip="true">
          
        </el-table-column>
        <el-table-column label="产品名称"
          prop="store_name"
          min-width="90"
          :show-overflow-tooltip="true">
          
        </el-table-column>
        <el-table-column label="套餐"
          prop="meal"
          min-width="90"
          :show-overflow-tooltip="true">
          
        </el-table-column>
        <!-- <el-table-column
          label="是否检票"
          min-width="80"
          align="center"
        > <template slot-scope="scope">
            <span v-if="scope.row.is_sign==1" style="color:red">已检票</span>
            <span v-if="scope.row.is_sign==0">未检票</span>
          </template>
        </el-table-column> -->
        <!-- <el-table-column
          label="验票时间"
          min-width="80"
          align="center"
        > <template slot-scope="scope">
            <span v-if="scope.row.useTimeDesc" style="color:red">{{scope.row.useTimeDesc}}</span>
            <span v-else>--</span>
          </template>
        </el-table-column> -->
        <el-table-column label="出发站点"
          prop="start_stop_name"
          min-width="90"
          :show-overflow-tooltip="true"
          >
        </el-table-column>

        <el-table-column label="到达站点"
          prop="end_stop_name"
          min-width="90"
          :show-overflow-tooltip="true"
          >
        </el-table-column>
      </el-table>
    </el-dialog>
    <!-- 查看乘客 -->

    <!-- 查看套餐 -->
    <el-dialog title="查看套餐" :visible.sync="mealVisible" width="40%" >
       <el-table
        v-loading="listLoading"
        :data="mealList"
        size="mini"
        :highlight-current-row="true"
        :header-cell-style=" {fontWeight:'bold'}"
      >
        <el-table-column label="套餐名称"
          prop="title"
          min-width="100"
        />
        <el-table-column label="套餐价格"
          prop="adult_price"
          min-width="100"
        />
      
      </el-table>
    </el-dialog>
    <!-- 查看乘客 -->

    <!-- 添加司机 车牌号 -->
    <el-dialog title="添加司机" :visible.sync="selectDriver" width="60%"  @close="closeForm('planForm')">
       <el-form :model="planForm" :rules="rules" ref="planForm" label-width="130px" class="formValidate mt20" >
          <el-form-item label="班次："  prop="date">
            <el-input v-model="planForm.date" disabled placeholder="请输入"></el-input>
          </el-form-item>
          <el-row>
            <el-col :span="10">
              <el-form-item label="司机姓名："  prop="driver_name">
                <el-input v-model="planForm.driver_name"  placeholder="请输入司机姓名"  style="width: 200px;"/>
              </el-form-item>
            </el-col>
            <el-col :span="14">
              <el-form-item label="车牌号："  prop="car_number">
                <el-input v-model="planForm.car_number"  placeholder="请输入车牌号"   style="width: 200px;"/>
              </el-form-item>
            </el-col>
          </el-row>
         
          <el-form-item class="acea-row row-center-wrapper">
            <el-button type="primary"  @click="addDc('planForm')">立即添加</el-button>
            <el-button @click="selectDriver=false">取消</el-button>
          </el-form-item>
        </el-form>
    </el-dialog>
    <!-- 添加司机 车牌号 -->
     <!-- 发送短信 -->
    <el-dialog title="发送短信" :visible.sync="sendFormVisible" width="40%"  @close="closeForm('sendForm')">
       <el-form :model="sendForm" :rules="rules" ref="sendForm" label-width="100px" class="formValidate mt20" >
         
          <el-form-item  label="短信类型："  prop="planType">
              <el-radio-group v-model="sendForm.sendType">
                <el-radio :label="1">预约成功</el-radio>
                <el-radio :label="2">预约失败</el-radio>
                <el-radio :label="3">晚点通知</el-radio>
              </el-radio-group>
          </el-form-item>
           <el-form-item label="备注：" prop="remark">
                <el-input maxlength="100" :show-word-limit="true" type="textarea" style="width:60%"  v-model="sendForm.notice" placeholder="输入备注"></el-input>
          </el-form-item>
         
          <el-form-item class="acea-row row-center-wrapper">
            <el-button type="primary"  @click="clickeSendSms('sendForm')">立即发送</el-button>
            <el-button @click="sendFormVisible=false">取消</el-button>
          </el-form-item>
        </el-form>
    </el-dialog>
    <!-- 发送短信 -->

    <el-dialog
        v-if="mealShowVisible"
        title="添加套餐"
        :visible.sync="mealShowVisible"
        width="50%"
        append-to-body
      >
        <div class="container display-flex display-flex-column display-flex-justify-center">
          <el-form :rules="rules" :model="tempMeal" label-width="150px" size="small">
            <el-form-item  label="套餐标题："   :rules="rules.temp_meal_title">
              <el-input v-model="tempMeal.title"  placeholder="请输入套餐标题" class="selWidth" size="small"  /> 
            </el-form-item>
                <el-form-item label="套餐价格："     :rules="rules.temp_meal_price">
                  <el-input-number v-model="tempMeal.adult_price" controls-position="right" placeholder="请输入套餐价格：" class="duanWidth" :min="0" :max="99999"></el-input-number>

                </el-form-item>
     
           
          </el-form>
          
        </div> 
        <span slot="footer" class="dialog-footer">
          <el-button @click="mealShowVisible = false" size="small">取消</el-button>
          <el-button v-if="tempMeal.index===''" type="primary" @click="handleAddMeal" size="small">确定添加</el-button>
          <el-button  v-else type="primary" @click="handleEditMeal" size="small">确定修改</el-button>

        </span>    
      </el-dialog> 

      <el-dialog
        v-if="planMealShowVisible"
        :title="tempPlanMeal.id?'编辑套餐':'添加套餐'"
        :visible.sync="planMealShowVisible"
        width="50%"
        append-to-body
      >
        <div class="container display-flex display-flex-column display-flex-justify-center">
          <el-form :rules="rules" :model="tempPlanMeal" label-width="150px" size="small">
            <el-form-item  label="套餐标题："   prop="plan_meal_title">
              <el-input v-model="tempPlanMeal.title"  placeholder="请输入套餐标题" class="selWidth" size="small"  /> 
            </el-form-item>
                <el-form-item label="套餐价格："     prop="plan_meal_price">
                  <el-input-number v-model="tempPlanMeal.adult_price" controls-position="right" placeholder="请输入套餐价格：" class="duanWidth" :min="0" :max="99999"></el-input-number>

                </el-form-item>
     
           
          </el-form>
          
        </div> 
        <span slot="footer" class="dialog-footer">
          <el-button @click="planMealShowVisible = false" size="small">取消</el-button>
          <el-button v-if="tempPlanMeal.index===''" type="primary" @click="handleAddPlanMeal" size="small">确定添加</el-button>
          <el-button  v-else type="primary" @click="handleEditPlanMeal" size="small">确定修改</el-button>

        </span>    
      </el-dialog>   
  </div>
</template>

<script>
// import { getCityListApi, getCompanyListApi, planListApi, 
//         lineLstApi, getRegularVersionApi, searchDriverApi,
//         searchCarApi, addLineRegularApi, addTemporaryPlanApi,
//         batchEditPlanApi, changePlanStatusApi, getOrderListByPlanIdApi,
//         planExcelApi, passengerExcelApi,sendPlanSmsApi  } from '@/api/bus'
import {planListApi , tourBusListApi,addTemporaryPlanApi , changePlanStatusApi, batchEditPlanApi, planExcelApi,passengerExeclApi ,getOrderListByPlanIdApi,sendPlanSmsApi}  from '@/api/product'
import createWorkBook from '@/utils/newToExcel.js';
export default {
  name: 'ProductList',
  data() {
    return {
      selectPlanMealIndex: 0,
      selectTempMealIndex:0,
      sendForm: {
        planId: '',
        sendType: 1,
        notice: ''
      },
      dateType: 1,
      date1: [],
			date2: [],
      checkList: [],
      selectDriver: false,
      exportPlanId:'',
      orderBusList: [],
      mealList: [],
      passengerVisible: false,
      driverOptions: [],
      carOptions: [],
      regularVersionList: [],
      mealVisible: false,
      planForm: {
        id: '',
        product_id:'',  
        type: '',
        date: '',
        stock: 0,
        plan_type: 1,
        lowest_num: 0,
        is_return_trip: 0,
        return_trip_date: '',
        return_mins: 0,
        remark: '',
        division_time:0,
        car_number: '',
        driver_name: '',
        line_plan_meal: [],
      },
      regularForm: {
        lineId: '',
        regularVersionId: '',
        planDatesRange: [],
        seat: 0,
        planType: 1,
        lowestNum: 0,
        adultPrice: 0,
        childPrice: 0,
        isReturnTrip: 0,
        returnMins: 0,
        ticketPrice: 0,
        remark: '',
        divisionTime:0,
        carId: '',
        driverId: '',
      },
      temporaryForm:{
        dp_time: '',
        product_id: '',
        date_list: [],
        stock: 0,
        plan_type: 1,
        lowest_num: 0,
        adult_price: 0,
        child_price: 0,
        is_return_trip: 0,
        return_mins: 0,
        remark: '',
        division_time:0,
        car_number: '',
        driver_name: '',
        line_plan_meal: [],
        dp_time_list: []
      },
      batchForm: {
        product_id: '',
        plan_dates_range: [],
        status: 1,
        is_return_trip: 0,
        return_mins: 0,
        remark: '',
        driver_name: '',
        car_number: '',
      },
      batchEditShow:false,
      addTemporaryPlanShow: false,
      showAddRegular: false,
      PlanFormVisible: false,
      sendFormVisible: false,
      options: [],
      list: [],
      loading: false,
      rules: {
        product_id: [
          { required: true, message: '请选择直通车产品', trigger: 'change' }
        ],
       
        plan_dates_range: [
          { required: true, type:'array', message: '请选择排班日期', trigger: 'change' }
        ],
        dp_time: [
          { required: true, message: '请选择出发时间', trigger: 'change' }
        ],
        stock: [
          { required: true,type:'number', message: '请输入座位', trigger: 'blur' }
        ],
        plan_type: [
          { required: true,type:'number',  message: '请选择班次类型', trigger: 'blur' }
        ],
        adult_price:  [
          { required: true,type:'number', message: '请输入成人价格', trigger: 'blur' }
        ],
         temp_meal_title: [
          {
            validator: (rule, value, callback) => {
              if (!this.tempMeal.title) {
                callback(new Error('请输入套餐标题'));
              } else {
                callback();
              }
            },
            required: true,
            trigger: 'blur'
          },
        ],

        temp_meal_price: [
          {
            validator: (rule, value, callback) => {
              if (this.tempMeal.adult_price==0) {
                callback(new Error('请输入套餐价格'));
              } else {
                callback();
              }
            },
            required: true,
            trigger: 'blur'
          },
        ],
        plan_meal_title: [
          {
            validator: (rule, value, callback) => {
              if (!this.tempPlanMeal.title) {
                callback(new Error('请输入套餐标题'));
              } else {
                callback();
              }
            },
            required: true,
            trigger: 'blur'
          },
        ],

        plan_meal_price: [
          {
            validator: (rule, value, callback) => {
              if (this.tempPlanMeal.adult_price==0) {
                callback(new Error('请输入套餐价格'));
              } else {
                callback();
              }
            },
            required: true,
            trigger: 'blur'
          },
        ],
         date_list: [
          {
            validator: (rule, value, callback) => {
              setTimeout(() => {
                if (!this.temporaryForm.date_list.length) {
                callback(new Error('请选择排班日期'));
              } else {
                callback();
              }
              },200)
            },
            required: true,
            type:'array', 
            trigger: 'change'
          },
        ], 
         dp_time_list: [
           {
            validator: (rule, value, callback) => {
              if (!this.temporaryForm.dp_time_list.length) {
                callback(new Error('请选择出发时间'));
              } else {
                callback();
              }
            },
            required: true,
            type:'array', 
            trigger: 'change'
          },
        ],
        line_plan_meal: [
           {
            validator: (rule, value, callback) => {
              if (!this.temporaryForm.line_plan_meal.length) {
                callback(new Error('请至少填写一个班次套餐信息'));
              } else {
                callback();
              }
            },
            required: true,
            type:'array', 
            trigger: 'change'
          },
        ],
        planForm_line_plan_meal: [
           {
            validator: (rule, value, callback) => {
              if (!this.planForm.line_plan_meal.length) {
                callback(new Error('请至少填写一个班次套餐信息'));
              } else {
                callback();
              }
            },
            required: true,
            type:'array', 
            trigger: 'change'
          },
        ],
       
      },
      props: {
        children: 'child',
        label: 'name',
        value: 'id',
        emitPath: false
      },
      // roterPre: roterPre,
      headeNum: [],
      listLoading: true,
      tableData: {
        data: [],
        total: 0
      },
      
      tableFrom: {
        page: 1,
        limit: 20,
        keyword: '',
        plan_dates_range: '',
        product_id:'',
        status: 1,
      },
      cityList: [],
      companyList: [],
      companyListOptions: [],
      objectUrl: process.env.VUE_APP_BASE_API,
      dialogVisible: false,
      card_select_show:false,
      checkAll: false,
      checkedCities: [ "ID", "班次时间",'产品名称', "线路编号", '出发城市','到达城市',"出发地", "目的地", "验证码","商户", "套餐信息","班次类型", "是否必发", "座位数", "售票数","司机-车牌","备注"],
      columnData: [ "ID", "班次时间", '产品名称',"线路编号", '出发城市','到达城市', "出发地", "目的地","验证码", "商户", "套餐信息", "班次类型", "是否必发", "座位数", "售票数","司机-车牌","备注"],
      isIndeterminate:true,
      mealShowVisible: false,
      flag: 0,
      tempMeal: {
        id: '',
        title: "",
        adult_price: 0,
        index: ''
      },
      planMealShowVisible: false,
      tempPlanMeal:{
        id: '',
        title: "",
        adult_price: 0,
        index: ''
      },
      value1: '',
    }
  },
  mounted() {
      // 今天的时间
    var day2 = new Date()
    day2.setTime(day2.getTime())
    var s2 = day2.getFullYear() + '-' + (day2.getMonth() + 1) + '-' + day2.getDate()
    this.tableFrom.plan_dates_range = [s2, s2]

    // this.getCityList()
    // this.getCompanyList()
    this.getList()
    // this.checkedCities = this.$cache.local.has('plans_stroge') ? this.$cache.local.getJSON('plans_stroge') : this.checkedCities;
  },
  methods: {
    dpChange(e){
      this.temporaryForm.dp_time_list.push(this.value1)
    },
    delDp(index){
      this.temporaryForm.dp_time_list.splice(index, 1)
    },

     deletePlanMeal(index){
       this.planForm.line_plan_meal.splice(index, 1);
       this.selectPlanMealIndex = 0;
       console.log("this.temporaryForm.line_plan_meal",   this.planForm.line_plan_meal)
    },
    selectPlanMealHanele(index){
      console.log('selectPlanMealHanele',index)
      setTimeout(() => {
          this.selectPlanMealIndex = index;
          this.flag++;
      }, 100);
    },
    editPlanMeal(item,index){
      console.log(item,index)
      this.tempPlanMeal = item;
      this.tempPlanMeal.index = index;
      this.planMealShowVisible = true;
    },
       addPlanMealShow(){
      this.planMealShowVisible = true;
       this.tempPlanMeal = {
        id: '',
        title: "",
        adult_price: 0,
        index: ''
      }
    },
    handleAddPlanMeal(){
      if(!this.tempPlanMeal.title){
        return this.$message.error("套餐标题不能为空")
      }
      if(this.tempPlanMeal.adult_price == 0){
        return this.$message.error("套餐价格不能为空")
      }
    
      this.planForm.line_plan_meal.push(this.tempPlanMeal);
      console.log("this.planForm.line_plan_meal",this.planForm.line_plan_meal)
      this.planMealShowVisible = false;
      this.tempPlanMeal = {
        id: '',
        title: "",
        adult_price: 0,
        index: ''
      }

    },
    handleEditPlanMeal(){
      if(!this.tempPlanMeal.title){
        return this.$message.error("套餐标题不能为空")
      }
      if(this.tempPlanMeal.adult_price == 0){
        return this.$message.error("套餐价格不能为空")
      }
      console.log("this.tempPlanMeal.index",this.tempPlanMeal.index)
      this.planForm.line_plan_meal[this.tempPlanMeal.index] = this.tempPlanMeal;

      this.planMealShowVisible = false;
       this.tempPlanMeal = {
        id: '',
        title: "",
        adult_price: 0,
        index: ''
      }

    },

    deleteTempMeal(index){
       this.temporaryForm.line_plan_meal.splice(index, 1);
       this.selectTempMealIndex = 0;
       console.log("this.temporaryForm.line_plan_meal",   this.temporaryForm.line_plan_meal)
    },
    selectMealHanele(index){
      console.log('selectMealHanele')
      setTimeout(() => {
          this.selectTempMealIndex = index;
          this.flag++;
      }, 100);
    },
    editMeal(item,index){
      console.log(item,index)
      this.tempMeal = item;
      this.tempMeal.index = index;
      this.mealShowVisible = true;
    },
    addmealShow(){
      this.mealShowVisible = true;
       this.tempMeal = {
        id: '',
        title: "",
        adult_price: 0,
        index: ''
      }
    },
    handleAddMeal(){
      if(!this.tempMeal.title){
        return this.$message.error("套餐标题不能为空")
      }
      if(this.tempMeal.adult_price == 0){
        return this.$message.error("套餐价格不能为空")
      }
    
      this.temporaryForm.line_plan_meal.push(this.tempMeal);
      console.log("this.temporaryForm.line_plan_meal",this.temporaryForm.line_plan_meal)
      this.mealShowVisible = false;
      this.tempMeal = {
        id: '',
        title: "",
        adult_price: 0,
        index: ''
      }

    },
    handleEditMeal(){
      if(!this.tempMeal.title){
        return this.$message.error("套餐标题不能为空")
      }
      if(this.tempMeal.adult_price == 0){
        return this.$message.error("套餐价格不能为空")
      }
      console.log("this.tempMeal.index",this.tempMeal.index)
      this.temporaryForm.line_plan_meal[this.tempMeal.index] = this.tempMeal;

      this.mealShowVisible = false;
       this.tempMeal = {
        id: '',
        title: "",
        adult_price: 0,
        index: ''
      }

    },
    datesChange(e){
			this.temporaryForm.date_list = e;
		},

		dateRangeChange(e){
			this.temporaryForm.date_list =  this.filterDatesByWeekdays(this.date1, this.checkList);
		
		},
		checkChange(e){
			this.temporaryForm.date_list =  this.filterDatesByWeekdays(this.date1, this.checkList);
	
		},
    // 筛选日期数组的函数  
		filterDatesByWeekdays(date, weekdays) {  

      if(!date) return
			const allDates = this.generateDateRange(date[0], date[1]);  
			const filteredDates = [];  
		
			for (let dateStr of allDates) {  
				const date = this.parseDate(dateStr);  
				const dayOfWeek = date.getDay(); // 注意：getDay() 返回 0（周日）到 6（周六）  
				// 由于 weekdays 数组是从 1 开始的，而 getDay() 是从 0 开始的，我们需要 +1 来匹配  
				if (weekdays.includes(dayOfWeek)) {  
					filteredDates.push(dateStr);  
				}  
			}  

			return filteredDates;  
		},  
		// 辅助函数，生成指定日期范围内的所有日期数组  
		generateDateRange(start, end) {  
			let arr = [];  
			let current = this.parseDate(start);  
			const endDate = this.parseDate(end);  
			
			while (current <= endDate) {  
				arr.push(current.toISOString().split('T')[0]); // 转换为 YYYY-MM-DD 格式的字符串  
				current.setDate(current.getDate() + 1);  
			}  
			
			return arr;  
		},
		// 辅助函数，将日期字符串转换为 Date 对象  
		parseDate(dateStr) {  
			return new Date(dateStr);  
		}, 
			
    remoteMethod(query) {
      if (query !== '') {
        this.loading = true;
        tourBusListApi({
          keyword: query.trim(),
          status: 1,
          page: 1,
          limit: 30,
          buy_type: 2
        }).then(res => {
           this.loading = false;
           this.options = res.data.list;
           console.log("this.options ",this.options )
        }).catch(res => {
          this.loading = false;
          this.$message.error(res.message);
        }) 

      } else {
        this.options = [];
      }
    },
    // 获取班次版本
    selectLine(item) {
      if(item){
        this.regularForm.lineId = item
        getRegularVersionApi(item).then(res => {
          this.regularVersionList = res
        }).catch(error => {
          console.log(error)
          this.$message.error(error.message);
        })
      }
    },

    // 搜索司机
    searchDriver(query){
      this.driverOptions = []
      if (query !== '') {
        this.loading = true
        var that = this
        searchDriverApi({keywords:query,page: 1,limit: 999}).then(res => {
          this.loading = false
          that.driverOptions = res.list
        }).catch(error => {
          console.log(error)
          this.$message.error(error.message);
        })
      } else {
        this.driverOptions = []
      }
    },
      // 搜索车辆
    searchCar(query){
      this.carptions = []
      if (query !== '') {
        this.loading = true
        var that = this
        searchCarApi({keywords:query,page: 1,limit: 999}).then(res => {
           this.loading = false
          that.carOptions = res.list
        }).catch(error => {
          console.log(error)
          this.$message.error(error.message);
        })
      } else {
        this.carOptions = []
      }
    },

        // 批量排班提交
    submRegularForm(formName) {
      this.$refs[formName].validate((valid) => {
        if (valid) {
          var that = this
          console.log(this.regularForm)
          this.$modal.loading();
          addLineRegularApi(that.regularForm).then(res => {
            this.$modal.closeLoading()
            this.showAddRegular = false
            this.getList();
            this.$refs[formName].resetFields();

          }).catch(error => {
            this.$modal.closeLoading()
            // this.$refs[formName].resetFields();
            this.$message.error(error.message);
          })
        } else {
          console.log('error submit!!')
        }
      })
    },

     // 临时排班提交
    submTemporaryForm(formName) {
      if(!this.temporaryForm.product_id){
        return this.$message.error("请选择产品");
      }  
      if(!this.temporaryForm.date_list.length){
				return this.$message.error("请选择排班周期,或者选择日期范围不包含指定日期");
			}
      if(!this.temporaryForm.dp_time_list.length){
        return this.$message.error("请至少添加一个出发时间");
      }
      if(!this.temporaryForm.line_plan_meal.length){
        return this.$message.error("请至少添加一个班次套餐");
      }
      if(this.temporaryForm.plan_type == 2 && !this.temporaryForm.division_time){
        return this.$message.error("请填写发车间隔时间");
      }
      if(this.temporaryForm.plan_type == 3 && !this.temporaryForm.lowest_num){
        return this.$message.error("请填写最低发车人数");
      }
      if(this.temporaryForm.is_return_trip  && !this.temporaryForm.return_mins){
        return this.$message.error("请填写返程分钟数");
      }
      // if(!this.temporaryForm.adult_price){
      //   return this.$message.error("请填写成人价格");
      // }
      // if(!this.temporaryForm.child_price){
      //   return this.$message.error("请填写儿童价格");
      // }
      this.$refs[formName].validate((valid) => {
        if (valid) {
          var that = this
          console.log(3443,that.temporaryForm)
          const loading = this.$loading();
          addTemporaryPlanApi(that.temporaryForm).then(res => {
            loading.close()
            this.addTemporaryPlanShow = false
            this.getList();
            this. dateType = 1
            this.date1 =  []
            this.date2 =  []
            this.checkList = []
            this.$refs[formName].resetFields();

            
          }).catch(error => {
            console.log(error)
            loading.close()
            this.$message.error(error.message);
          })
        } else {
           console.log('error submit!!')
        }
      })
    },

    
    // 批量修改
    submBatchForm(formName) {
      this.$refs[formName].validate((valid) => {
        if (valid) {
          var that = this
          this.$loading();
          batchEditPlanApi(that.batchForm).then(res => {
            this.batchEditShow = false
            this.getList();
            this.$loading().close()
            this.$refs[formName].resetFields();
          }).catch(error => {
            console.log(error)
            this.$loading().close()
            this.$message.error(error.message);
          })
        } else {
          console.log('error submit333!!')
          
        }
      })
    },


    // 编辑班次 
    editPlan(formName) {
      this.$refs[formName].validate((valid) => {
        if (valid) {
          this.planForm.type = "edit"
          this.$loading()
          changePlanStatusApi(this.planForm).then(res => {
            this.PlanFormVisible = false
            this.getList();
            this.$message.success('修改成功');
            this.$loading().close()
            this.$refs[formName].resetFields();
          }).catch(error => {
            this.$loading().close()
            this.$message.error(error.message);
          })
        } else {
          console.log('error submit333!!')
        }
      })
    },
    
    // 更改状态
    changePlaneStatusClick(type, item) {
      this.$confirm('您是否要更改状态, 是否继续?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        this.$loading();
        this.planForm.type = type
        this.planForm.id = item.id
        changePlanStatusApi(this.planForm).then(res => {
            this.$message.success('修改成功');
            this.getList();
            this.$loading().close();
          }).catch(error => {
            this.$loading().close();
            this.$message.error(error.message);
        })
      }).catch((err) => {
        console.log(123,err)
        this.$message({
          type: 'info',
          message: '已取消'
        });          
      });
    },

       // 编辑班次
   ediePlanClick(item) {
      this.PlanFormVisible = true
      this.selectPlanMealIndex = 0;
      this.planForm = {
        id: item.id,
        product_id: item.product_id,
        type: 'edit',
        date: item.date,
        stock: item.stock,
        plan_type: item.plan_type,
        lowest_num: item.lowest_num,
        is_return_trip: item.is_return_trip,
        return_trip_date: item.is_return_trip?item.return_trip_date:'',
        remark: item.remark,
        division_time: item.division_time,
        line_plan_meal: item.linePlanMeal
      }
      
    },
    timestampToTime(timestamp) {
        var date = new Date(timestamp * 1000);//时间戳为10位需*1000，时间戳为13位的话不需乘1000
        var Y = date.getFullYear() + '-';
        var M = (date.getMonth()+1 < 10 ? '0'+(date.getMonth()+1) : date.getMonth()+1) + '-';
        var D = date.getDate() + ' ';
        var h = date.getHours() + ':';
        var m = date.getMinutes() ;
        return Y+M+D+h+m;
    },

    /** *
    * 选择司机
    */
    driverClick: function(item) {
      this.selectDriver = true
      this.planForm.date = item.date
      this.planForm.id = item.id
    },

     //  
    addDc(formName) {
      if(!this.planForm.car_number){
         this.$message.error("缺少车牌号");
         return;
      }
      this.$refs[formName].validate((valid) => {
        if (valid) {
          this.planForm.type = "addDc"
          this.$loading();
          changePlanStatusApi(this.planForm).then(res => {
            this.selectDriver = false
            this.getList();
            this.$message.success('修改成功');
            this.$loading().close()
            this.$refs[formName].resetFields();
          }).catch(error => {
            this.$loading().close()
            this.$message.error(error.message);
          })
        } else {
          console.log('error submit333!!')
        }
      })
    },


       /** *
   * 发送短信
   */
    sendSms: function(item) {
      if(item.sales <=0){
        this.$message.error("售票数为零，不能发送短信！");
        return;
      }
      this.sendFormVisible = true
      this.sendForm = {
        planId: item.id,
        sendType: 1,
        notice: ''
      }
    },

       // 发送短信
    clickeSendSms: function() {
      console.log(this.sendForm)

      this.$loading()
      sendPlanSmsApi(this.sendForm).then(res => {
        this.$message.success('发送成功')
        this.$loading().close();
        this.getList();
        this.sendFormVisible = false
      }).catch(error => {
        this.$loading().close()

        this.sendFormVisible = false
        this.$message.error(error.message);
        this.sendFormVisible = false
      })
    },
    // 查看乘客
    lookPassenger(item) {
      this.orderBusList = []
      this.passengerVisible = true
      this.listLoading = true
      this.exportPlanId = item.id;
      getOrderListByPlanIdApi({plan_id:  item.id, page: 1, limit: 9999}).then(res => {
         this.listLoading = false
        this.orderBusList = res.data
      }).catch(res => {
        this.listLoading = false
        this.$message.error(res.message);
      })
    },

    lookMeal(item) {
      if(!item.linePlanMeal.length) {
        return    this.$message.error("缺少套餐信息")
      }
      this.mealList = [];
      this.mealVisible = true;
      this.listLoading = true;
      this.mealList = item.linePlanMeal;
        this.listLoading = false;
    },
    //  selectReturnTrip(date){
    //   this.value5 = date
    // },

    closeForm(formName) {
      this.showAddRegular = false
      this.$refs[formName].resetFields()
    },
    getCityList(){
      getCityListApi().then(res => {
        this.cityList = res
      }).catch(res => {
        this.$message.error(res.message);
      })
    },
    getCompanyList(){
      getCompanyListApi().then(res => {
        this.companyList = res
      }).catch(res => {
        this.$message.error(res.message);
      })
    },
    

        // 具体日期
    onchangeTime (e) {
      this.tableFrom.plan_dates_range = e;
      this.tableFrom.page = 1
      this.getList();
    },
    
    selectCity(e){
      this.companyListOptions = []
      this.companyListOptions = this.companyList.filter(el => {
        return e == el.cityId
      })
      
    },
    seachList() {
      this.tableFrom.page = 1
      this.getList()
    },
    handleClose() {
      this.dialogVisible = false
    },
    handleCloseMod(item){
      this.dialogVisible = item
      this.goodHeade();
      this.getList();
    },
    // 复制
    onCopy(){
      this.dialogVisible = true
    },
   
    async exports() {
      let excelData = JSON.parse(JSON.stringify(this.tableFrom)), data = []
      excelData.page = 1
      excelData.limit = 99999
      let pageCount = 1
      let lebData = {};
      for (let i = 0; i < pageCount; i++) {
        lebData = await this.downData(excelData)
        pageCount = Math.ceil(lebData.count/excelData.limit)
        if (lebData.export.length) {
          data = data.concat(lebData.export)
          excelData.page++
        }  
      }
      createWorkBook(lebData.header, lebData.title, data, lebData.foot,lebData.filename);
      return
    },
    /**资金流水 */
    downData(excelData) {
      return new Promise((resolve, reject) => {
        planExcelApi(excelData).then((res) => {
          return resolve(res.data)
        })
      })
    },

 
    downPassengerData(excelData) {
      return new Promise((resolve, reject) => {
        passengerExeclApi(excelData).then((res) => {
          return resolve(res.data)
        })
      })
    },

    async exportPassenger() {
      if(!this.exportPlanId){
         this.$message.error("缺少班次ID")
         return;
      }
      let excelData = {}, data = []
      excelData.page = 1
      excelData.limit = 99999
      excelData.plan_id = this.exportPlanId
      let pageCount = 1
      let lebData = {};
      for (let i = 0; i < pageCount; i++) {
        lebData = await this.downPassengerData(excelData)
        pageCount = Math.ceil(lebData.count/excelData.limit)
        if (lebData.export.length) {
          data = data.concat(lebData.export)
          excelData.page++
        }  
      }
      createWorkBook(lebData.header, lebData.title, data, lebData.foot,lebData.filename);
      return
    },
   
    // 列表
    getList() {
      this.listLoading = true
      planListApi(this.tableFrom).then(res => {
        this.tableData.data = res.data.list
        this.tableData.total = res.data.count
        this.listLoading = false
      }).catch(err => {
        this.listLoading = false
        console.log('123',err)
        this.$message.error(err.message)
      })
    },
    pageChange(page) {
      this.tableFrom.page = page
      this.getList()
    },
    handleSizeChange(val) {
      this.tableFrom.limit = val
      this.getList()
    },

  
    renderHeader(h) {
      return(
        <p>
          <span style="padding-right:5px;">操作</span>
          <i class="el-icon-setting" onClick={()=>this.handleAddItem()}></i>
        </p>
      )
    },
    handleAddItem(){
      if(this.card_select_show){
        this.$set(this,'card_select_show',false);
      }else if(!this.card_select_show){
        this.$set(this,'card_select_show',true);
      }
    },
    handleCheckAllChange(val) {
      this.checkedCities = val ? this.columnData : [];
      this.isIndeterminate = false;
    },
    handleCheckedCitiesChange(value) {
      let checkedCount = value.length;
      this.checkAll = checkedCount === this.columnData.length;
      this.isIndeterminate = checkedCount > 0 && checkedCount < this.columnData.length;
    },
    checkSave(){
      this.card_select_show = false;
      this.$cache.local.setJSON(
        'goods_stroge',this.checkedCities
      );
    },
  }
}
</script>

<style scoped lang="scss">
   .el-table__body {
    width: 100%;
    table-layout: fixed !important;
  }
  .taoBaoModal{
  //  z-index: 3333 !important;
  }
  .demo-table-expand{
    ::v-deep label{
      width: 82px;
    }
  }
  .demo-table-expand{
    ::v-deep .el-form-item__content{
      width: 77%;
    }
  }
  .selWidth{
    width: 350px !important;
  }
  .seachTiele{
    line-height: 30px;
  }
  .relative{
    position: relative;
  }
  .card_abs{
    position: absolute;
    padding-bottom: 15px;
    top:260px;
    right:40px;
    width: 200px;
    background: #fff;
    z-index: 99999;
    box-shadow: 0px 0px 14px 0px rgba(0, 0, 0, 0.1);
  }
  .cell_ht{
    height: 50px;
    padding: 15px 20px;
    box-sizing: border-box;
    border-bottom: 1px solid #eeeeee;
    display: flex;
    justify-content: space-between;
    align-items: center;
  }
  .check_cell{
    width: 100%;
    padding:15px 20px 0;
  }
  .mt-1{
    margin-top:6px;
  }
  ::v-deep .el-checkbox__input.is-checked+.el-checkbox__label{
    color: #606266;
  }

  .meal-bl-noselect {
    border-radius: 5px;
    max-width: 300px;
    border: 1px solid #e5e5e5;
    background: #f7f7f7;
    padding: 5px 10px;
    color: #000;
    font-weight: 700;
    max-height: 150px;
    line-height: 30px;
}
.meal-bl-select {
    border-radius: 5px;
    max-width: 300px;
    border: 1px solid #3c72e4;
    background: #f5f8ff;
    padding: 5px 10px;
    color: #000;
    font-weight: 700;
    max-height: 150px;
     line-height: 30px;
}
.del-box{
		position: absolute;
		right: -25px;
		top: -18px;
		cursor: pointer;
		.iconfont{
			color: #8f8f8f;
			font-size: 24px;
		}
	}

  
  .dp{
  display: flex;
  justify-content: flex-start;
}

::v-deep {
  .dp-block{
    .el-input__inner{
      width: 80px !important;
    }
  }
}
.dp-block{
    position: absolute;
    top: -3px;
    opacity: 0.01;
    width: 80px;
}
.select-tags{
    position: absolute;
    line-height: normal;
    white-space: normal;
    z-index: 1;
    top: 50%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
}

.info-guiji {

  position: absolute;
  min-width: 200px;
  left: 1rem;
  padding: 2rem;
  z-index: 99999;
}

</style>
